<template>
  <div>
    <h3>会员权益</h3>
    <input type="button" value="增加" @click="add">
    <div>
      权益名称：<input type="text" v-model="query.RightName"><input type="button" value="查询" @click="getlist">
    </div>
    <table class="table table-bordered">
      <tbody>
        <tr>
          <td>RightId</td>
          <td>RightName</td>
          <td>操作</td>
        </tr>
        <tr v-for="item in list">
          <td>{{item.RightId}}</td>
          <td>{{item.RightName}}</td>
          <td>
            <input type="button" value="修改" @click="update(item.RightId)">
            <input type="button" value="删除" @click="del(item.RightId)">
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script setup lang="ts">

import { reactive,toRefs,onMounted } from 'vue';
import axios from 'axios';
import { useRouter,useRoute } from 'vue-router'; 
const router = useRouter();
const route=useRoute();

let data:any=reactive({
  query:{
    RightName:'',
  },
  list:[],
})
let {query,list}= toRefs(data);

onMounted(()=>{
  getlist();
})

const getlist=()=>{

  let obj={
    RightName:query.value.RightName,
  }

  axios({
    url:'/api/one/Rightshow/Rightshow',
    method:'get',
    params:obj,
  })
  .then((res)=>{
  console.log(res)
  list.value=res.data.data;
  })
  .catch((err)=>{
    console.log(err)
  })
}

const del=(RightId:any)=>{
  let f=confirm("确认删除吗?");
  if(f==true){
      let obj ={
        RightId:RightId,
      }
    axios({
    url:'/api/one/Rightdel/Rightdel',
    method:'delete',
    params:obj,
    })
    .then((res)=>{
      console.log(res);
      if(res.data.data>0){
        alert('删除成功');
        getlist();
      }
      else
      {
        alert('删除失败');
      }
    })
    .catch((err)=>{
      console.log(err);
    })
  }
}

const update=(RightId:any)=>{
    router.push({
      path:'/main/memberRightUpdate',
      query:{
        RightId:RightId,
      }
    })
}


const add=()=>{

  router.push('/main/MeberRightadd')

}



</script>

<style scoped>

</style>